<%--
 救灾分析页面
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
    <title>救灾分析</title>
    <!-- 引入bootstrap -->
    <link rel="stylesheet" type="text/css" href="/css/bootstrap.min.css">
    <!-- 引入JQuery  bootstrap.js-->
    <style>

        input::-webkit-outer-spin-button,
        input::-webkit-inner-spin-button{
            -webkit-appearance: none !important;
            margin: 0;
        }


    </style>
    <script src="../../../js/echarts.min.js"></script>
    <script src="/js/jquery-3.2.1.min.js"></script>
    <script src="/js/bootstrap.min.js"></script>
    <script src="/js/jquery.easyui.min.js"></script>

    <%--    <script type="text/javascript" src="https://cdn.jsdelivr.net/npm/echarts@5.3.2/dist/echarts.min.js"></script>--%>
    <style>
        .mod-tab .tab{
            float:left;
            padding:5px 20px;
            border-top:1px solid #ccc;
            border-left:1px solid #ccc;
            background-color:#ddd;
        }
        .header .tab:last-child{
            border-right:1px solid #ccc;
        }
        .content{
            border:1px solid #ccc;
            width:300px;
            height:200px;
        }
        .header::after{
            content:'';
            display:block;
            clear:both;
        }

        .mod-tab .header .active{
            background-color:#fff;
        }

        .mod-tab .content .panel{
            display:none
        }
        .mod-tab .content .active{
            display:block;
        }
    </style>

</head>
<body>
<!-- 顶栏 -->
<jsp:include page="top.jsp"></jsp:include>

<div class="col-md-2">
    <div class="panel panel-default">
        <div class="panel-heading">
            <div class="row">
                <ul class="nav nav-pills nav-stacked" id="nav">

                    <li> <button class="btn btn-success disabled">火灾救灾分析<span class="badge pull-right "></span></button></li>
                    <li><a href="/plan/disaster_Relief_Analysis">灾害气体燃爆分析<span class="badge pull-right"></span></a></li>
                    <li><a href="/plan/disaster_Relief_Analysis2">烟流蔓延分析<span class="badge pull-right"></span></a></li>
                    <li><a href="/plan/disaster_Relief_Analysis3">瓦斯积聚分析<sapn class=" glyphicon glyphicon-repeat  pull-right"/></a></li>
                    <li><a href="/admin/contingencyPlan">返回<sapn class="badge pull-right"/></a></li>
                </ul>


            </div>
        </div>
    </div>
</div>
<h1 class="text-center">瓦斯积聚分析</h1>
<div class="col-md-10">
<div class="mod-tab">
    <div class="header">

        <button class="tab active">掘进巷道</button>
        <button class="tab">回采工作面</button>

    </div>
    <div class="content">

        <div class="panel active">
            <table class="table table-bordered">
                <thead>
                <tr>
                    <th>编号*</th>
                    <th><input type="text" id="bianhao"></th>
                    <th>名称</th>
                    <th><input type="text" id="mingc"></th>

                </tr>
                </thead>
                <tbody>
                <tr>
                    <td>长度</td>
                    <td><input type="text" id="cahngdu">（单位：米）</td>
                    <td>横截面积</td>
                    <td><input type="text" id="henjie">（单位:平方米）</td>

                </tr>
                <tr>
                    <td>掘进选项</td>
                    <td><input type="radio" name="radio1" value="value1" />单项掘进
                        <input type="radio" name="radio1" value="value2" />双向掘进
                        <input type="radio" name="radio1" value="value3" />三向掘进
                        <input type="radio" name="radio1" value="value4" />四向掘进
                    </td>
                    <td>煤层厚度</td>
                    <td><input type="text" id="meic">（单位:米）</td>

                </tr>
                <tr>
                    <td>煤密度</td>
                    <td><input type="text" id="meimidu">（单位:千克/立方米）</td>
                    <td>平均掘进速度</td>
                    <td><input type="text" id="pingjun">（单位:米/分钟）</td>

                </tr>
                <tr>
                    <td>煤壁瓦斯涌出初始速度</td>
                    <td><input type="text" id="meibi">（单位:立方米/（平方米*分钟）</td>
                    <td>挥发分含量</td>
                    <td><input type="text" id="huifa">（单位:%）</td>

                </tr>
                <tr>
                    <td>煤层原始瓦斯含量</td>
                    <td><input type="text" id="meicnws">（单位:立方米/吨）</td>
                    <td>运出后残存含量</td>
                    <td><input type="text" id="hanl">（单位:立方米/吨）</td>

                </tr>
                <tr>
                    <td>掘进巷道瓦斯涌出量</td>

                    <td><input type="text" id="jjwsycl">（单位:立方米/分钟）</td>

                </tr>
                <tr>

                    <td><input type="button" id="jisu" value="计算" class="text-center"></td>

                </tr>

                </tbody>
            </table>
        </div>
        <div class="panel">
            <table class="table table-bordered">
                <thead>
                <tr>
                    <th>编号*</th>
                    <th><input type="text" id="bianhao1"></th>
                    <th>名称</th>
                    <th><input type="text" id="mingc1"></th>

                </tr>
                </thead>
                <tbody>
                <tr>
                    <td>回采率</td>
                    <td><input type="text" id="huicai">（单位：%）</td>
                    <td>工作面长度</td>
                    <td><input type="text" id="gzmcd">（单位:平方米）</td>

                </tr>

                <tr>
                    <td>开采层采高</td>
                    <td><input type="text" id="kaicaic">（单位:米）</td>
                    <td>开采层采厚</td>
                    <td><input type="text" id="kaicaicch">（单位:米）</td>

                </tr>
                <tr>
                    <td>预排等值宽度</td>
                    <td><input type="text" id="yupai">（单位:米</td>
                    <td>围岩瓦斯涌出系数</td>
                    <td><input type="radio" name="radio2" value="value1" />全部填充
                        <input type="radio" name="radio2" value="value2" />局部填充
                        <input type="radio" name="radio2" value="value3" />全部冒落

                    </td>

                </tr>
                <tr>
                    <td>煤层原始瓦斯含量</td>
                    <td><input type="text" id="meicnws2">（单位:立方米/吨）</td>
                    <td>运出后残存含量</td>
                    <td><input type="text" id="hanl2">（单位:立方米/吨）</td>

                </tr>
                <tr>
                    <td>开采层瓦斯相对涌出量</td>

                    <td><input type="text" id="kaicicws">（单位:立方米/分钟）</td>

                </tr>
                <tr>

                    <td><input type="button" id="jisu2" value="计算" class="text-center"></td>

                </tr>

                </tbody>
            </table>
        </div>

    </div>
</div>
</div>
</body>
<script>
    $('.mod-tab .tab').on('click',function(e){
//   console.log($(this))
        $(this).addClass('active')
            .siblings().removeClass('active')
        console.log($(this).index())

        $(this).parents('.mod-tab')
            .find('.panel')
            .eq($(this).index())
            .addClass('active')
            .siblings()
            .removeClass('active')
    })
</script>

</html>
